<template>
  <div>
   <template v-for="(item, index) in questionnaireList">
     <div :key="item.id">
       <span  :style="{'margin-left': hierarchy*20+'px','font-size':(30-hierarchy*3>5?30-hierarchy*3:15)+'px'}" v-if="item.isLeafNode ==='1'">
         {{index+1}}.{{item.name}}({{item.score}}分)
         <questionnaire :radio="radio" :hierarchy="hierarchy+1" :questionnaireList = "item.children" v-if="item.children!=null && item.children.length>0"></questionnaire>
       </span>
       
       <div v-else>
         <span  :style="{'margin-left': hierarchy*20+'px','font-size':(30-hierarchy*3>5?30-hierarchy*3:15)+'px'}">
         {{index+1}}.{{item.name}}({{item.score}}分)
         <div>
          <el-radio-group v-for="item1 in item.options" :key="item1.id" v-model="radio[index]" :style="{'margin-left': hierarchy*20+40+'px','font-size':30-hierarchy*3-1>5?30-hierarchy*3-1:14+'px'}">
            <el-radio  :label="item1.id">{{item1.name}}:{{item1.content}}({{item1.weight}}分)</el-radio>
         </el-radio-group>
         </div>
       </span>
       </div>
     </div>
   </template>
  </div>
</template>

<script>
export default {
  name: 'questionnaire',
  data () {
    return {
     
    }
  },
  props: {
    questionnaireList: {
      type: Array,
      required: true
    },
    hierarchy: {
      type: Number,
      required: false
    },
    radio:{
      type: Array,
      required: false
    }
  },
  created () {
  
  },
  methods:{
    
  }
}
</script>

<style scoped>

</style>